@extends('web.layout')
@section('title','个人信息修改')
@section('head')
    <script>
        function previewImage(file) {
            var MAXWIDTH = 90;
            var MAXHEIGHT = 90;
            var div = document.getElementById('preview');
            if(file.files && file.files[0]) {
                div.innerHTML = '<img id=imghead onclick=$("#previewImg").click()>';
                var img = document.getElementById('imghead');
                img.onload = function() {
                    var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
                    img.width = rect.width;
                    img.height = rect.height;
                    //						img.style.marginTop = rect.top + 'px';
                }
                var reader = new FileReader();
                reader.onload = function(evt) { img.src = evt.target.result; }
                reader.readAsDataURL(file.files[0]);
            }
        }

        function clacImgZoomParam(maxWidth, maxHeight, width, height) {
            var param = { top: 0, left: 0, width: width, height: height };
            if(width > maxWidth || height > maxHeight) {
                rateWidth = width / maxWidth;
                rateHeight = height / maxHeight;

                if(rateWidth > rateHeight) {
                    param.width = maxWidth;
                    param.height = Math.round(height / rateWidth);
                } else {
                    param.width = Math.round(width / rateHeight);
                    param.height = maxHeight;
                }
            }
            param.left = Math.round((maxWidth - param.width) / 2);
            param.top = Math.round((maxHeight - param.height) / 2);
            return param;
        }
    </script>

@endsection
@section('content')
    <div class="uploadImg">
        <span>头像</span>
        <div class="uploadhead">
            <div id="preview">
                <img id="imghead" border="0" src="{{asset($user->headimgurl)}}" width="90" height="90" >
            </div>
            {{--<input type="file" onChange="previewImage(this)" style="display: none;" id="previewImg">--}}
        </div>

    </div>
    <form>
        <div class="upload">
            <ul>
                <li>
                    <label>名称<input type="text" placeholder="{{$user->nickname}}" disabled/></label>
                </li>
                <li>
                    <label>手机号码<input  placeholder="请输入您的手机号,手机号不可修改" value="{{$user->mobile}}"  name="mobile" type="tel"/></label>
                </li> <li>
                    <label>身份证号<input  placeholder="请输入您的身份证号" value="{{$user->id_number}}"  name="id_number" type="text"/></label>
                </li>
                <li>
                    <label>真实姓名<input  placeholder="请输入您的真实姓名" value="{{$user->truename}}"  name="truename" type="text"/></label>
                </li>
            </ul>
        </div>
        <div class="audio">
            <a href="javascript:void(0)" class="aBtn ajax-submit">确定</a>
        </div>
        <div class="weui-toast weui_loading_toast" id="toast-form"><div class="weui_loading"><i class="weui-loading weui-icon_toast"></i></div><p class="weui-toast_content">数据加载中</p></div>
    </form>
@endsection
@section('foot')
    <script>
        var _url = '{{route('user_profile')}}';
        var return_url='{{$return_url}}';
        $(function () {
            $(document).on('click','.ajax-submit',function () {
                $('#toast-form').addClass('weui-toast--visible')
                var data = {
                    mobile:$('[name=mobile]').val(),
                    id_number:$('[name=id_number]').val(),
                    truename:$('[name=truename]').val(),
                    return_url:return_url
                }
                $.post(
                    _url,
                    data,
                    function (e) {
                        $('#toast-form').removeClass('weui-toast--visible')
                        console.log(e);
                        if(e.code==-1){
                            $.alert(e.info)
                        }else{
                          /* if(e.url!=''){
                                window.location.href=e.url;
                            }*/
                            $.toast(e.info,function () {
                                window.location.href=e.url;
                            })
                            
                        }
                    },
                    'json'
                )
            })
        })
    </script>
@endsection